<html>
<head>
  <title>Evernote Export</title>
  <basefont face="微软雅黑" size="2" />
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  <meta name="exporter-version" content="YXBJ Windows/600646 (zh-CN, DDL); Windows/10.0.0 (Win64);"/>
  <meta name="content-class" content="yinxiang.markdown"/>
  <style>
    body, td {
      font-family: 微软雅黑;
      font-size: 10pt;
    }
  </style>
</head>
<body>
<a name="1477"/>

<div><span><div style="font-size: 14px; margin: 0; padding: 0; width: 100%;"><h3 style="line-height: 160%; box-sizing: content-box; font-weight: 700; font-size: 27px; color: #333;">UI 系统</h3>
<hr style="line-height: 160%; box-sizing: content-box; border-top: 1px solid #eee; margin: 16px 0;"/>
<h4 style="line-height: 160%; box-sizing: content-box; font-size: 20px; color: #333;">概括</h4>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">在老引擎的基础上做了部分代码移植(C++-&gt;Lua)，C++ 部分只保留 Core 部分的代码。</p>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">UI 布局</p>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">沿用 UI 编辑器生成 json 的方式</li>
</ul>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">属性设置</p>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><strong style="line-height: 160%; box-sizing: content-box; font-weight: 700;">UI_Register.h</strong> 导出了各个控件的接口，通过接口设置属性</li>
</ul>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">控件查找</p>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">名字成了一个可选项，在局部范围(子节点以及更下层节点)根据名字查找</li>
</ul>
<pre style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; margin: 2px 0 8px; background-color: #f5f7f8;"><code style="display: block; overflow-x: auto; background: #1e1e1e; line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; letter-spacing: -.3px; padding: 18px; color: #f4f4f4; white-space: pre-wrap;">    <span style="color: #dcdcdc; line-height: 160%; box-sizing: content-box;"><span style="color: #569cd6; line-height: 160%; box-sizing: content-box;">function</span> <span style="color: #dcdcdc; line-height: 160%; box-sizing: content-box;">GUIWindow:child</span><span style="color: #dcdcdc; line-height: 160%; box-sizing: content-box;">(name)</span></span>
</code></pre>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">监听以及处理事件</p>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">每个 GUIWindow 对象都有一个唯一 Id，根据此 Id 和 事件名来注册具体的回调函数</li>
</ul>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">
<p style="line-height: 160%; box-sizing: content-box; color: #333; margin: 0;">全局管理</p>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">ui_schedule.lua 负责窗口调度，比如当某个游戏事件来了会打开或者关闭某个(些)窗口</li>
</ul>
</li>
</ul>
<h4 style="line-height: 160%; box-sizing: content-box; font-size: 20px; color: #333;">窗口</h4>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">每创建一个 window 类会在 lua\client\ui\windows\ 目录下建一个对应 lua 文件, 文件名约定是 &quot;win_xxxx.lua&quot;，比如主面板就是 &quot;win_main.lua&quot;</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">每一个 window 类会有几个固定函数
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">Init</code>，初始化，每个窗口对象整个生命期只会调用一次，它负责载入布局文件，以及监听各个控件的回调事件</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">onOpen</code>, 打开窗口时被调用</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">onClose</code>, 关闭窗口时被调用(并不会释放窗口对象)</li>
</ul>
</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">打开/关闭
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333; margin-top: 0; margin-bottom: 0;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">UI:openWnd(&quot;main&quot;)</code></li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">UI:closeWnd(&quot;main&quot;)</code></li>
</ul>
</li>
</ul>
<h4 style="line-height: 160%; box-sizing: content-box; font-size: 20px; color: #333;">自定义控件</h4>
<ul style="line-height: 160%; box-sizing: content-box; display: block; list-style-type: disc; padding-left: 30px; margin: 6px 0 10px; color: #333;">
<li style="line-height: 160%; box-sizing: content-box; position: relative;">目录在 lua\client\ui\widget\，文件命名为 &quot;widget_xxx.lua&quot;</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;"><code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">Init</code>，初始化，负责载入布局文件，以及注册监听回调事件等</li>
<li style="line-height: 160%; box-sizing: content-box; position: relative;">通过 <code style="line-height: 160%; box-sizing: content-box; border: 0; border-radius: 0; color: #c1788b; padding: 4px 4px 2px 0; letter-spacing: -.3px;">UIMgr:new_widget(&quot;xxx&quot;)</code> 来创建一个 widget 对象，可以像普通 GUIWindow 去使用它。</li>
</ul>
</div><center style="display:none !important;visibility:collapse !important;height:0 !important;white-space:nowrap;width:100%;overflow:hidden">%23%23%23%20UI%20%E7%B3%BB%E7%BB%9F%0A---%0A%23%23%23%23%20%E6%A6%82%E6%8B%AC%0A*%20%E5%9C%A8%E8%80%81%E5%BC%95%E6%93%8E%E7%9A%84%E5%9F%BA%E7%A1%80%E4%B8%8A%E5%81%9A%E4%BA%86%E9%83%A8%E5%88%86%E4%BB%A3%E7%A0%81%E7%A7%BB%E6%A4%8D(C%2B%2B-%3ELua)%EF%BC%8CC%2B%2B%20%E9%83%A8%E5%88%86%E5%8F%AA%E4%BF%9D%E7%95%99%20Core%20%E9%83%A8%E5%88%86%E7%9A%84%E4%BB%A3%E7%A0%81%E3%80%82%0A%0A*%20UI%20%E5%B8%83%E5%B1%80%0A%20%20%20%20*%20%E6%B2%BF%E7%94%A8%20UI%20%E7%BC%96%E8%BE%91%E5%99%A8%E7%94%9F%E6%88%90%20json%20%E7%9A%84%E6%96%B9%E5%BC%8F%0A*%20%E5%B1%9E%E6%80%A7%E8%AE%BE%E7%BD%AE%0A%20%20%20%20*%20**UI_Register.h**%20%E5%AF%BC%E5%87%BA%E4%BA%86%E5%90%84%E4%B8%AA%E6%8E%A7%E4%BB%B6%E7%9A%84%E6%8E%A5%E5%8F%A3%EF%BC%8C%E9%80%9A%E8%BF%87%E6%8E%A5%E5%8F%A3%E8%AE%BE%E7%BD%AE%E5%B1%9E%E6%80%A7%0A*%20%E6%8E%A7%E4%BB%B6%E6%9F%A5%E6%89%BE%0A%20%20%20%20*%20%E5%90%8D%E5%AD%97%E6%88%90%E4%BA%86%E4%B8%80%E4%B8%AA%E5%8F%AF%E9%80%89%E9%A1%B9%EF%BC%8C%E5%9C%A8%E5%B1%80%E9%83%A8%E8%8C%83%E5%9B%B4(%E5%AD%90%E8%8A%82%E7%82%B9%E4%BB%A5%E5%8F%8A%E6%9B%B4%E4%B8%8B%E5%B1%82%E8%8A%82%E7%82%B9)%E6%A0%B9%E6%8D%AE%E5%90%8D%E5%AD%97%E6%9F%A5%E6%89%BE%0A%20%20%20%20%60%60%60lua%0A%20%20%20%20%20%20%20%20function%20GUIWindow%3Achild(name)%0A%20%20%20%20%60%60%60%0A*%20%E7%9B%91%E5%90%AC%E4%BB%A5%E5%8F%8A%E5%A4%84%E7%90%86%E4%BA%8B%E4%BB%B6%0A%20%20%20%20*%20%E6%AF%8F%E4%B8%AA%20GUIWindow%20%E5%AF%B9%E8%B1%A1%E9%83%BD%E6%9C%89%E4%B8%80%E4%B8%AA%E5%94%AF%E4%B8%80%20Id%EF%BC%8C%E6%A0%B9%E6%8D%AE%E6%AD%A4%20Id%20%E5%92%8C%20%E4%BA%8B%E4%BB%B6%E5%90%8D%E6%9D%A5%E6%B3%A8%E5%86%8C%E5%85%B7%E4%BD%93%E7%9A%84%E5%9B%9E%E8%B0%83%E5%87%BD%E6%95%B0%0A*%20%E5%85%A8%E5%B1%80%E7%AE%A1%E7%90%86%0A%20%20%20%20*%20ui_schedule.lua%20%E8%B4%9F%E8%B4%A3%E7%AA%97%E5%8F%A3%E8%B0%83%E5%BA%A6%EF%BC%8C%E6%AF%94%E5%A6%82%E5%BD%93%E6%9F%90%E4%B8%AA%E6%B8%B8%E6%88%8F%E4%BA%8B%E4%BB%B6%E6%9D%A5%E4%BA%86%E4%BC%9A%E6%89%93%E5%BC%80%E6%88%96%E8%80%85%E5%85%B3%E9%97%AD%E6%9F%90%E4%B8%AA(%E4%BA%9B)%E7%AA%97%E5%8F%A3%0A%0A%23%23%23%23%20%E7%AA%97%E5%8F%A3%0A*%20%E6%AF%8F%E5%88%9B%E5%BB%BA%E4%B8%80%E4%B8%AA%20window%20%E7%B1%BB%E4%BC%9A%E5%9C%A8%20lua%5Cclient%5Cui%5Cwindows%5C%20%E7%9B%AE%E5%BD%95%E4%B8%8B%E5%BB%BA%E4%B8%80%E4%B8%AA%E5%AF%B9%E5%BA%94%20lua%20%E6%96%87%E4%BB%B6%2C%20%E6%96%87%E4%BB%B6%E5%90%8D%E7%BA%A6%E5%AE%9A%E6%98%AF%20%22win_xxxx.lua%22%EF%BC%8C%E6%AF%94%E5%A6%82%E4%B8%BB%E9%9D%A2%E6%9D%BF%E5%B0%B1%E6%98%AF%20%22win_main.lua%22%0A*%20%E6%AF%8F%E4%B8%80%E4%B8%AA%20window%20%E7%B1%BB%E4%BC%9A%E6%9C%89%E5%87%A0%E4%B8%AA%E5%9B%BA%E5%AE%9A%E5%87%BD%E6%95%B0%0A%20%20%20%20*%20%60Init%60%EF%BC%8C%E5%88%9D%E5%A7%8B%E5%8C%96%EF%BC%8C%E6%AF%8F%E4%B8%AA%E7%AA%97%E5%8F%A3%E5%AF%B9%E8%B1%A1%E6%95%B4%E4%B8%AA%E7%94%9F%E5%91%BD%E6%9C%9F%E5%8F%AA%E4%BC%9A%E8%B0%83%E7%94%A8%E4%B8%80%E6%AC%A1%EF%BC%8C%E5%AE%83%E8%B4%9F%E8%B4%A3%E8%BD%BD%E5%85%A5%E5%B8%83%E5%B1%80%E6%96%87%E4%BB%B6%EF%BC%8C%E4%BB%A5%E5%8F%8A%E7%9B%91%E5%90%AC%E5%90%84%E4%B8%AA%E6%8E%A7%E4%BB%B6%E7%9A%84%E5%9B%9E%E8%B0%83%E4%BA%8B%E4%BB%B6%0A%20%20%20%20*%20%60onOpen%60%2C%20%E6%89%93%E5%BC%80%E7%AA%97%E5%8F%A3%E6%97%B6%E8%A2%AB%E8%B0%83%E7%94%A8%0A%20%20%20%20*%20%60onClose%60%2C%20%E5%85%B3%E9%97%AD%E7%AA%97%E5%8F%A3%E6%97%B6%E8%A2%AB%E8%B0%83%E7%94%A8(%E5%B9%B6%E4%B8%8D%E4%BC%9A%E9%87%8A%E6%94%BE%E7%AA%97%E5%8F%A3%E5%AF%B9%E8%B1%A1)%0A*%20%E6%89%93%E5%BC%80%2F%E5%85%B3%E9%97%AD%0A%20%20%20%20*%20%60UI%3AopenWnd(%22main%22)%60%0A%20%20%20%20*%20%60UI%3AcloseWnd(%22main%22)%60%0A%0A%23%23%23%23%20%E8%87%AA%E5%AE%9A%E4%B9%89%E6%8E%A7%E4%BB%B6%0A*%20%E7%9B%AE%E5%BD%95%E5%9C%A8%20lua%5Cclient%5Cui%5Cwidget%5C%EF%BC%8C%E6%96%87%E4%BB%B6%E5%91%BD%E5%90%8D%E4%B8%BA%20%22widget_xxx.lua%22%0A*%20%60Init%60%EF%BC%8C%E5%88%9D%E5%A7%8B%E5%8C%96%EF%BC%8C%E8%B4%9F%E8%B4%A3%E8%BD%BD%E5%85%A5%E5%B8%83%E5%B1%80%E6%96%87%E4%BB%B6%EF%BC%8C%E4%BB%A5%E5%8F%8A%E6%B3%A8%E5%86%8C%E7%9B%91%E5%90%AC%E5%9B%9E%E8%B0%83%E4%BA%8B%E4%BB%B6%E7%AD%89%0A*%20%E9%80%9A%E8%BF%87%20%60UIMgr%3Anew_widget(%22xxx%22)%60%20%E6%9D%A5%E5%88%9B%E5%BB%BA%E4%B8%80%E4%B8%AA%20widget%20%E5%AF%B9%E8%B1%A1%EF%BC%8C%E5%8F%AF%E4%BB%A5%E5%83%8F%E6%99%AE%E9%80%9A%20GUIWindow%20%E5%8E%BB%E4%BD%BF%E7%94%A8%E5%AE%83%E3%80%82%0A%0A</center></span>
</div></body></html> 